import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0
import QtQuick.Controls.Material 2.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Login Example")
    
    // Set Material theme colors
    Material.accent: Material.Teal
    Material.primary: Material.Indigo
    
    // Property to track login state
    property bool isLoggedIn: false
    
    StackView {
        id: stackView
        anchors.fill: parent
        initialItem: loginPage
    }
    
    // Login page component
    Component {
        id: loginPage
        LoginPage {
            // When login is successful, show the main content
            LoginPageForm {
                loginButton.onClicked: {
                    if (usernameField.text.length > 0 && passwordField.text.length > 0) {
                        isLoggedIn = true
                        stackView.push(mainContentPage)
                    }
                }
            }
        }
    }
    
    // Main content component (shown after login)
    Component {
        id: mainContentPage
        
        Page {
            header: ToolBar {
                Material.background: Material.primary
                
                RowLayout {
                    anchors.fill: parent
                    
                    Label {
                        text: qsTr("Welcome")
                        color: "white"
                        font.pixelSize: 20
                        elide: Label.ElideRight
                        horizontalAlignment: Qt.AlignHCenter
                        verticalAlignment: Qt.AlignVCenter
                        Layout.fillWidth: true
                    }
                    
                    ToolButton {
                        text: qsTr("Logout")
                        contentItem: Text {
                            text: parent.text
                            font: parent.font
                            opacity: enabled ? 1.0 : 0.3
                            color: "white"
                            horizontalAlignment: Text.AlignHCenter
                            verticalAlignment: Text.AlignVCenter
                            elide: Text.ElideRight
                        }
                        onClicked: {
                            isLoggedIn = false
                            stackView.pop()
                        }
                    }
                }
            }
            
            SwipeView {
                id: swipeView
                anchors.fill: parent
                currentIndex: tabBar.currentIndex
                
                Page {
                    Label {
                        text: qsTr("Second page")
                        anchors.centerIn: parent
                    }
                }
            }
            
            footer: TabBar {
                id: tabBar
                currentIndex: swipeView.currentIndex
                TabButton {
                    text: qsTr("First")
                }
                TabButton {
                    text: qsTr("Second")
                }
            }
        }
    }
}
